import React, { PureComponent } from 'react';
import { connect } from 'dva';
import { DateDiff, DateStamp, FormatnumberZero, Mover, NumberDivide } from '@/function.js';
// 视图插件
import { Card, Form } from 'antd';
// 外部组件
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
import Fundanalysis from './Fundanalysis.js';
// css OR less预编译器
// import styles from './All.less';

// 图片

/**
 *  Describe:数据连接
 *  Created by xjc on 2019/5/15
 */

@connect(({ newTwoDaily, loading }) => ({
  newTwoDaily,
  loading: loading.models.newTwoDaily,
}))
@Form.create()
class NewTwoWorth extends PureComponent {
  componentWillMount() {}

  /**
   *  Describe:当前状态
   *  Created by xjc on 2019/5/15
   */

  state = {
    charts: {},
  };

  /**
   *  Describe:视图
   *  Created by xjc on 2019/5/15
   */

  render() {
    const { charts } = this.state;
    return (
      <PageHeaderWrapper>
        <Card>
          {charts.list ? (
            <div
              style={{
                textAlign: 'center',
                marginLeft: '-1%',
                fontWeight: '600',
                fontSize: '1rem',
              }}
            >
              {charts.name}&nbsp;&nbsp;{charts.list[charts.list.length - 1].date} 涨幅：
              {`${(
                ((charts.list[charts.list.length - 1].fundNetValue -
                  charts.list[charts.list.length - 2].fundNetValue) /
                  charts.list[charts.list.length - 2].fundNetValue) *
                100
              ).toFixed(2)}%`}
              &nbsp;&nbsp;spy涨幅：
              {`${(
                ((charts.list[charts.list.length - 1].spyNetValue -
                  charts.list[charts.list.length - 2].spyNetValue) /
                  charts.list[charts.list.length - 2].spyNetValue) *
                100
              ).toFixed(2)}%`}
            </div>
          ) : null}
          <br />
          <br />
          <Fundanalysis charts={charts} />
        </Card>
      </PageHeaderWrapper>
    );
  }

  componentDidMount() {
    const { dispatch } = this.props;
    const that = this;
    /* 导入列表数据 */
    dispatch({
      type: 'newTwoDaily/GetCurve',
      callback: res => {
        that.setState({ charts: res });
      },
    });
  }

  componentWillUnmount() {}
}

export default NewTwoWorth;
